<template>
  <div class="caseCarousel">
    <div class="bg"></div>
    <el-carousel
      :interval="4000"
      type="card"
      height="300px"
      class="carousel"
      indicator-position="none"
    >
      <el-carousel-item v-for="item in 6" :key="item">
        <img :src="require('@/assets/img/caseCarousel.jpg')" alt="" />
      </el-carousel-item>
    </el-carousel>
  </div>
</template>
<script>
export default {
  name: "CaseCarousel",
  components: {},
  data() {
    return {};
  },
};
</script>
<style lang="scss" scoped>
.caseCarousel {
  width: 1200px;
  margin: 0 auto 50px;
  .bg {
    background: #058e70;
    height: 270px;
  }
}
.carousel {
  margin-top: -230px;
}

::v-deep .el-carousel__item img {
  width: 100%;
}
::v-deep .el-carousel__item {
  width: 300px;
  margin: 0 150px;
}
</style>